$font-size-base: 16px;
$margin-common: 24 + $font-size-base 0;
$color-blue: #2196F3;
.vuestic-switch {
  cursor: pointer;
  display: flex;
  flex-direction: row;
  margin: $margin-common;
  .vuestic-switch-option {
	padding: 0.313rem 2.375rem;
	border-top: 0.125rem solid transparent;
	border-bottom: 0.125rem solid $color-blue;
	background-color: transparent;
	transition: all 0.15s ease;
	width: 50%;
	display: flex;
	justify-content: center;
	align-items: center;

	&.active {
	  color: #fff;
	  background-color: $color-blue;
	}

	&:not(.active):hover {
	  color: $color-blue;
	}
  }
}
